<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>css语法
    </title>
</head>
<body>
    <h1>css语法</h1>
    <p>css层叠样式表 cascading style sheets</p>
    <img src="./img/d1.png" alt="480px" height="120px">
    <h2>css如何工作</h2>
    <ol>
        <li>
        浏览器加载html
    </li>
<li>将html转化为dom</li>
<li>浏览器会拉取html相关资源（web服务器相应浏览器）</li>
<li>浏览器对css进行解析，根据选择器的不同类型，把他们分到不同的容器中
    ，浏览器基于不同规则应用对应的dom节点上并添加不同的依赖样式
</li>
<li>按照规则应用于渲染树后，渲染树会依照对应应该出现的结构布局</li>
<li>网页显示</li>

<img src="./img/d2.png" alt="" width="700px" height="380px">
</ol>
</body>
</html>